<div class="home">
    <header class="mui-bar mui-bar-nav home-top">
        <a class="mui-pull-left">
            <img src="../../images/header.png" alt="">
        </a>
        <div id="searchpanel" class="mui-input-row mui-search">
            <input type="search" class="mui-input-clear" placeholder="">
        </div>
        <a class="mui-icon mui-icon-contact mui-pull-right"></a>
    </header>
    <div class="bananer">
        <div id="slider" class="mui-slider">
            <div class="mui-slider-group mui-slider-loop">
                <!--支持循环，需要重复图片节点-->
                <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img
                            src="../../images/pro3.jpg" /></a></div>
                <div class="mui-slider-item">
                    <a href="#">
                        <img src="../../images/pro1.jpg" />
                        <p class="mui-slider-title">农家自种、当天采收、当天发货，鲜嫩茭白</p>
                    </a>
                </div>
                <div class="mui-slider-item">
                    <a href="#">
                        <img src="../../images/pro2.jpg" />
                        <p class="mui-slider-title">幸福就是可以一起吃饭</p>
                    </a>
                </div>
                <div class="mui-slider-item">
                    <a href="#">
                        <img src="../../images/pro3.jpg" />
                        <p class="mui-slider-title">幸福就是可以一起玩</p>
                    </a>
                </div>
                <!--支持循环，需要重复图片节点-->
                <div class="mui-slider-item mui-slider-item-duplicate"><a href="#"><img
                            src="../../images/pro1.jpg" /></a></div>
            </div>
            <div class="mui-slider-indicator mui-text-right">
                <div class="mui-indicator mui-active"></div>
                <div class="mui-indicator"></div>
                <div class="mui-indicator"></div>
            </div>
        </div>
    </div>

    <div class="headertitle">
        <b></b>
        热门商品
    </div>
    <div class="hotproduct">
        <div id="product-panel">

            <div class="product-item">
                <img src="../../images/muer.jpg">
                <div class="product-data">
                    <span class="product-title">长白山黑木耳纯野生特级小碗耳500g包邮云秋木耳干货散装东北特产</span>
                    <span class="product-bottom">￥<span class="product-price">129.<span
                                class="price-fixed">00</span></span></span>
                </div>
            </div>

            <div class="product-item">
                <img src="../../images/pro4.jpg">
                <div class="product-data">
                    <span class="product-title">鑫炳记太谷饼山西特产30袋糕点零食整</span>
                    <span class="product-bottom">￥<span class="product-price">128.<span
                                class="price-fixed">99</span></span></span>
                </div>
            </div>

            <div class="product-item">
                <img src="../../images/lajiao.jpg">
                <div class="product-data">
                    <span class="product-title">汉源鲜花椒2斤 保鲜麻椒藤椒四川特产</span>
                    <span class="product-bottom">￥<span class="product-price">43.<span
                                class="price-fixed">00</span></span></span>
                </div>
            </div>

            <div class="product-item">
                <img src="../../images/huajiao.jpg">
                <div class="product-data">
                    <span class="product-title">湖南特产酸辣藠头新鲜茭头腌制泡菜</span>
                    <span class="product-bottom">￥<span class="product-price">19.<span
                                class="price-fixed">99</span></span></span>
                </div>
            </div>


        </div>
    </div>

</div>
<script>
    var gallery = mui('#slider');
    gallery.slider({
        interval: 5000//自动轮播周期，若为0则不自动播放，默认为0；
    });

</script>